﻿<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="default.aspx.cs" Inherits="ZDatePickerTest._default" %>

<%@ Register Assembly="ZebraDatePickerDotNet" TagPrefix="CF" Namespace="ZebraDatePickerDotNet" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <script type="text/javascript" src="/zdatepicker/jquery-1.4.4.min.js"></script>
    <script src="/zdatepicker/persian-calendar.js"></script>
    <script type="text/javascript" src="/zdatepicker/javascript/zebra_datepicker_cal.js"></script>
    <link rel="stylesheet" href="/zdatepicker/css/default.css" />
    <style type="text/css">
        body, input {
            font-family: tahoma;
            font-size: 9pt;
        }
        input {
            padding: 5px;
            border: 1px solid silver;
        }
    </style>
</head>
<body>
    <form id="form1" runat="server">
        <asp:ScriptManager runat="server"></asp:ScriptManager>
        <div>
            <asp:UpdateProgress runat="server" ID="pnlprogress" AssociatedUpdatePanelID="pnla">
                <ProgressTemplate>
                    <p style="border-style: solid; border-width: 1px; padding: 5px; color: #800000; background-color: rgb(241, 224, 224); font-weight: bold;">Updating...</p>
                </ProgressTemplate>
            </asp:UpdateProgress>
            <asp:UpdatePanel runat="server" ID="pnla">
                <ContentTemplate>
                   <p> <CF:ZDatePicker DefaultConfiguration="datepicker_fa_IR" runat="server" ID="DERT" />
                    &nbsp;
                    <CF:ZDatePicker runat="server" ID="ZDatePicker1" /></p>
                    <p><asp:Label runat="server" ID="dtOne"></asp:Label></p>
                    <br/>
                    <asp:Button runat="server" ID="samplebtn" Text="Post Back" OnClick="samplebtn_OnClick" />
                </ContentTemplate>
            </asp:UpdatePanel>
        </div>
    </form>
    <p>
        &nbsp;</p>
    <p>
        Used these libraries:</p>
    <ul>
        <li>Zebra Datepicker :&nbsp;&nbsp; <a href="http://stefangabos.ro/jquery/zebra-datepicker/" target="_blank">http://stefangabos.ro/jquery/zebra-datepicker/</a> by <span class="author">Stefan Gabos</span></li>
        <li>Calendar convert based on codes: <a href="http://www.fourmilab.ch/documents/calendar/">http://www.fourmilab.ch/documents/calendar/</a> by John Walker -- September, MIM</li>
    </ul>
    <p>
        &nbsp;</p>
    <p>
        To use date picker:</p>
    <p>
        Include these files in your page: (or master page)</p>
    <pre>
&lt;script type="text/javascript" src="/zdatepicker/calendar.js"&gt;&lt;/script&gt;
&lt;script type="text/javascript" src="/zdatepicker/javascript/zebra_datepicker_cal.js"&gt;&lt;/script&gt;
&lt;link rel="stylesheet" href="/zdatepicker/css/default.css" /&gt;
</pre>
    <p>
        then register contorl to your page:</p>
<pre>
&lt;%@ Register Assembly="ZebraDatePickerDotNet" TagPrefix="CF" Namespace="ZebraDatePickerDotNet" %&gt;
</pre>
    <p>and use datepicker any where you need</p>
    <pre>&lt;CF:ZDatePicker DefaultConfiguration="datepicker_fa_IR" runat="server" ID="DERT" /&gt;</pre>
    <p></p>
</body>
</html>
